<div ng-controller="AppCtrl" class="md-padding demo">
  <div layout="row" layout-wrap>
    <div flex="100" layout="column">
      <div>
        <!--
          In IE, we cannot apply flex directly to <fieldset>
          @see https://github.com/philipwalton/flexbugs#9-some-html-elements-cant-be-flex-containers
        -->
        <fieldset class="demo-fieldset" >
          <legend class="demo-legend">Using &lt;md-checkbox&gt; with the 'indeterminate' attribute </legend>
          <div layout="row" layout-wrap flex>
          <div flex-xs flex="50">
            <md-checkbox aria-label="Select All"
                         ng-checked="isChecked()"
                         md-indeterminate="isIndeterminate()"
                         ng-click="toggleAll()">
              <span ng-if="isChecked()">Un-</span>Select All
            </md-checkbox>
          </div>
            <div class="demo-select-all-checkboxes" flex="100" ng-repeat="item in items">
              <md-checkbox ng-checked="exists(item, selected)" ng-click="toggle(item, selected)">
               {{ item }}
              </md-checkbox>
            </div>
          </div>
        </fieldset>
      </div>
    </div>
</div>
